<template>
  <div style="display: inline-block;">
   <slot name="title">
      <span @click="searchOperateLog(id || null)">{{text}}</span>
    </slot> 
    <j-modal
      :title="title"
      :width="modalWidth"
      :visible="visible"
      :confirmLoading="confirmLoading"
      switchFullscreen
      wrapClassName="j-popup-modal"
      @ok="handleClose"
      @cancel="handleClose"
      cancelText="关闭"
    >
    <template slot="footer">
       <a-button @click="handleClose">关闭</a-button>
    </template>
      <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :md="8" :sm="8">
            <a-form-item label="操作人">
              <a-input placeholder="请输入操作人" v-model="queryParam.user"></a-input>
            </a-form-item>
          </a-col>
          <a-col :md="8" :sm="8">
            <a-form-item label="操作内容">
              <a-input placeholder="请输入操作内容" v-model="queryParam.content"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left; overflow: hidden" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
      <a-card :bordered="false">
        <a-table
          ref="table"
          size="middle"
          :scroll="{ x: true }"
          bordered
          rowKey="id"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="ipagination"
          :loading="loading"
          class="j-table-force-nowrap"
          @change="handleTableChange"
        >
          <span slot="contentSlot" slot-scope="text">
            <a-tooltip>
              <template slot="title"> {{ text }}</template>
              <div class="content">
              {{ text }}
            </div>
            </a-tooltip>
          </span>
        </a-table>
      </a-card>
    </j-modal>
  </div>
</template>
<script>
import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'
import { getAction } from '@/api/manage'
export default {
  components: {  },
  name: 'JOperateLog',
  mixins: [JeecgListMixin,mixinDevice],
  props: {
    text: {
      type: String,
      default:'日志'
    },
    id:{
      type: String,
    },
  },
  data() {
    return {
      title: '操作日志',
      modalWidth: 1000,
      visible: false,
      confirmLoading: false,
      loading: false,
      selectedRowKeys: [],
      selectionRows: [],
      disableMixinCreated:true,
      queryParam: {
        relateId:'',
      },
      relateId:this.id,
      //表头
      columns: [
        {
          title: '#',
          dataIndex: '',
          key: 'rowIndex',
          width: 60,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '操作人',
          align: 'center',
          dataIndex: 'user',
        },
        {
          title: '操作时间',
          align: 'center',
          dataIndex: 'operateTime',
        },
        {
          title: '操作类型',
          align: 'center',
          dataIndex: 'operateType_dictText',
        },
        {
          title: '操作内容',
          align: 'center',
          dataIndex: 'content',
          width: 500,
          scopedSlots: { customRender: 'contentSlot' },
        },
      ],
      dataSource: [],
      /* 分页参数 */
      ipagination: {
        current: 1,
        pageSize: 10,
        pageSizeOptions: ['10', '20', '30', '50', '100'],
        showTotal: (total, range) => {
          return range[0] + '-' + range[1] + ' 共' + total + '条'
        },
        showQuickJumper: true,
        showSizeChanger: true,
        total: 0,
      },
      /* 排序参数 */
      isorter: {
        column: 'operateTime',
        order: 'desc',
      },
      url: {
        list: '/sys/common/operateLog/list',
      },
    }
  },
  methods: {
    //弹出操作日志页面
    searchOperateLog(id) {
      this.visible = true
      this.relateId = id ? id :this.relateId
      this.queryParam.relateId = this.relateId 
      if (!this.queryParam.relateId) {
         this.$message.warning('relateId不能为空')
         return
      }else{
        this.loadData()
      }
    },
     searchQuery() {
      this.loadData(1);
    },
    searchReset() {
       this.queryParam={
        relateId: this.relateId,
      }
      this.loadData(1);
    },
    selectRowData(record, index) {
      const that = this
      return {
        on: {
          dblclick: () => {
            this.handleDetail(record)
          },
        },
      }
    },
    //关闭弹窗
    handleClose(){
      this.visible = false
      this.relateId = null
      this.queryParam.relateId = null
    }
  
  },

}
</script>
<style scoped>
.content {
  width: 500px;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  white-space: nowrap;
}
</style>